<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">实盘接入</block>
		</cu-custom>
		<view class="cu-bar solid-top solid-bottom ">
			<view class="action">
				<text class="cuIcon-titles text-orange"></text> API信息
			</view>
		</view>
		<view class="cu-form-group">
			<view class="title">Okex ApiKey</view>
			<input placeholder="在此输入Api Key" v-model="bind.apiKey" ></input>
		</view>
		<view class="cu-form-group">
			<view class="title">Okex SecretKey</view>
			<input placeholder="在此输入Secret Key" v-model="bind.secretKey" ></input>
		</view>
		<view class="cu-form-group">
			<view class="title">Okex Passphrase</view>
			<input placeholder="在此输入Passphrase" v-model="bind.passphrase" ></input>
		</view>
		<view class="cu-bar solid-top solid-bottom ">
			<view class="action">
				<text class="cuIcon-titles text-orange"></text> 谁可以订阅我
			</view>
		</view>
		<radio-group class="block" @change="radioChange">
			<view class="cu-form-group" v-for="(item,index) in redioItems" :key='index'>
				<view class="title">{{item.name}}</view>
				<view v-if="item.value=='bkb'">
					<input placeholder="订阅耗费积分" v-model="bind.bkbCast"  type="number" ></input>
				</view>
				<radio class='radio blue' :class="item.checked?'checked':''" :checked="item.checked?true:false" :value="item.value"></radio>
			</view>
		</radio-group>
		<view class="cu-bar solid-top solid-bottom ">
			<view class="action">
				<text class="cuIcon-titles text-orange"></text> 展示范围
			</view>
		</view>
		<checkbox-group class="block bg-white solid-bottom padding-df">
			<view class="text-sm-left text-bold text-orange padding-left-lg ">我的资产</view>
			<view class="uni-row justify-around">
				<view class="uni-row padding-lr-df" v-for="item in checkItemsZc" :key="item.value" @click="checkBoxChange(checkItemsZc,item)">
					<view class="title">{{item.name}}</view>
					<view>
						<checkbox class='blue margin-left-sm' :class="item.checked?'checked':''" :checked="item.checked?true:false"
						 :value="item.value"></checkbox>
					</view>
				</view>
			</view>
		</checkbox-group>
		<checkbox-group class="block bg-white solid-bottom padding-df">
			<view class="text-sm-left text-bold text-orange padding-left-lg ">我的持仓</view>
			<view class="uni-row justify-around">
				<view class="uni-row padding-lr-df" v-for="item in checkItemsCc" :key="item.value" @click="checkBoxChange(checkItemsCc,item)">
					<view class="title">{{item.name}}</view>
					<view>
						<checkbox class='blue margin-left-sm' :class="item.checked?'checked':''" :checked="item.checked?true:false"
						 :value="item.value"></checkbox>
					</view>
				</view>
			</view>
		</checkbox-group>
		<checkbox-group class="block bg-white solid-bottom padding-df">
			<view class="text-sm-left text-bold text-orange padding-left-lg ">我的操作</view>
			<view class="uni-row justify-around">
				<view class="uni-row padding-lr-df" v-for="item in checkItemsCz" :key="item.value" @click="checkBoxChange(checkItemsCz,item)">
					<view class="title">{{item.name}}</view>
					<view>
						<checkbox class='blue margin-left-sm' :class="item.checked?'checked':''" :checked="item.checked?true:false"
						 :value="item.value"></checkbox>
					</view>
				</view>
			</view>
		</checkbox-group>
		<view class="padding flex flex-direction">
			<button class="cu-btn bg-gradual-blue lg" @tap="clickBind">授权接入</button>
		</view>
	</view>
</template>

<script>
	var _self
	export default {
		data() {
			return {
				bind: {
					apiKey: '',
					secretKey: '',
					passphrase: '',
					platform: 'okex', //huobi binance,
					accountScope: 'everyone',
					positionScope: 'everyone',
					actionScope: 'everyone',
					joinType: 'everyone',
					bkbCast: 100
				},
				redioItems: [{
						value: 'onlyme',
						name: '不对外订阅',
						checked: true
					}, {
						value: 'everyone',
						name: '免费订阅',
						checked: false
					},
					{
						value: 'bkb',
						name: '币客积分订阅',
						checked: false
					},
					{
						value: 'serial',
						name: '激活码订阅',
						checked: false
					}
				],
				current: 0,
				checkItemsZc: [{
						value: 'everyone',
						name: '公开可见',
						checked: true
					},
					{
						value: 'joinme',
						name: '订阅我可见',
						checked: false

					}, {
						value: 'myself',
						name: '仅自己可见',
						checked: false
					}
				],
				checkItemsCc: [{
						value: 'everyone',
						name: '公开可见',
						checked: true
					},
					{
						value: 'joinme',
						name: '订阅我可见',
						checked: false

					}, {
						value: 'myself',
						name: '仅自己可见',
						checked: false
					}
				],
				checkItemsCz: [{
						value: 'everyone',
						name: '公开可见',
						checked: true
					},
					{
						value: 'joinme',
						name: '订阅我可见',
						checked: false

					}, {
						value: 'myself',
						name: '仅自己可见',
						checked: false
					}
				]

			}
		},
		onLoad() {
			_self = this
			this.cleanPara()
		},
		methods: {
			cleanPara() {
				this.bind = {
					apiKey: '',
					secretKey: '',
					passphrase: '',
					platform: 'okex', //huobi binance,
					accountScope: 'everyone',
					positionScope: 'everyone',
					actionScope: 'everyone',
					joinType: 'everyone',
					bkbCast: 100
				}
			},
			radioChange: function(evt) {
				for (let i = 0; i < this.redioItems.length; i++) {
					this.redioItems[i].checked = (this.redioItems[i].value === evt.target.value)
				}
				console.log(this.current)
			},
			checkBoxChange: function(group, item) {
				for (let i = 0; i < group.length; i++) {
					if (group[i].value === item.value) {
						group[i].checked = true
					} else {
						group[i].checked = false
					}
				}

			},
			clickBind() {
				console.log("click bind")
				this.bind.accountScope = this.getCheckedValue(this.checkItemsZc)
				this.bind.positionScope = this.getCheckedValue(this.checkItemsCc)
				this.bind.actionScope = this.getCheckedValue(this.checkItemsCz)
				this.bind.joinType = this.getCheckedValue(this.redioItems)
				console.log(this.bind)
				if (_self.assertNotEmpty(this.bind.apiKey, 'apiKey不能为空') &&
					_self.assertNotEmpty(this.bind.secretKey, 'secretKey不能为空') &&
					_self.assertNotEmpty(this.bind.passphrase, 'passphrase不能为空') &&
					_self.assertNotEmpty(this.bind.joinType, '订阅范围不能为空') &&
					_self.assertNotEmpty(this.bind.accountScope, '资产范围不能为空') &&
					_self.assertNotEmpty(this.bind.positionScope, '持仓范围不能为空') &&
					_self.assertNotEmpty(this.bind.actionScope, '操作范围不能为空')
				) {
					if (this.bind.joinType == 'bkb') {
						if (this.bind.bkbCast < 100) {
							uni.showToast({
								title: '订阅积分小于100'
							})
							return
						}
					} else {
						this.bind.bkbCast = -1
					}
					uni.request({
						url: this.api + '/credentials/bind',
						method: 'POST',
						header: {
							"Authorization": "Bearer " + this.getToken()
						},
						data: this.bind,
						success: res => {
							console.log("get clickBind resps")
							console.log(res.data)
							if(_self.ifElseReturn(res)){
								uni.showToast({
									title: '绑定成功',
									complete: () => {
										uni.navigateBack({
											delta:1
										})
									}
								})
							}
						
						}
					});
				}


			},
			getCheckedValue(group) {
				for (let i = 0; i < group.length; i++) {
					if (group[i].checked) return group[i].value
				}
			}
		}
	}
</script>

<style>
	.cu-form-group .title {
		min-width: calc(4em + 15px);
	}
</style>
